<template>
  <!-- <a-card title="申请单据" :bodyStyle="{paddingTop:'0px',maxHeight:type === 'history_his'?'':'400px',overflowY:'auto',textAlign: spinning?'center':'left'}" size="small"> -->
    <a-spin size="large" :spinning="spinning">
      <k-form-build
        ref="kfb"
        :value="processData.formJson"
        :defaultValue="processData.formData"
        v-if="Object.keys(processData.formJson).length !== 0"
        :disabled="disabledAll"
      />
      <a-tabs v-if="processData.appendFormList.length>0" >
        <template v-for="(appendForm,i) in processData.appendFormList">
          <a-tab-pane v-if="JSON.parse(appendForm.formJson).list.length" :key="i" :tab="appendForm.nodeName">
            <k-form-build :ref="'kfd'+i" :value="JSON.parse(appendForm.formJson)" :defaultValue="appendForm.formData && JSON.parse(appendForm.formData)" :disabled="disabledAll" />
          </a-tab-pane>
        </template>
      </a-tabs>
    </a-spin>
  <!-- </a-card> -->
</template>

<script>
import {
  getFormByProcessDefinitionId,
  getFormDataByProcessInstanceId,
  getHistoryFormDataByProcessInstanceId
} from '@/api/process'
import { KFormBuild } from '@/components/k-form-design/index'
export default {
  name: 'taskKdf',
  components: {
    KFormBuild
  },
  data() {
    return {
      disabledAll: true,
      processData: {
        formJson: {},
        formData: {},
        appendFormList: []
      },
      spinning: false
    }
  },
  props: {
    taskData: {
      type: Object,
      default: () => {}
    },
    type: {
      type: String,
      default: ''
    }
  },
  methods: {
    async loadKDF() { // 根据任务信息获取kdf表单设计器数据及流程任务表单数据
      try {
        this.spinning = true
        let formDataRes
        if (this.type === 'history_his') { // 历史任务、我发起的流程   申请单据数据
          formDataRes = await getHistoryFormDataByProcessInstanceId({ taskId: this.taskData.id, processInstanceId: this.taskData.processInstanceId })
          if (!formDataRes.success) {
            return this.$message.error(formDataRes.message)
          }
        } else {
          formDataRes = await getFormDataByProcessInstanceId({ taskId: this.taskData.id, id: this.taskData.formDataId, processInstanceId: this.taskData.processInstanceId })
          if (!formDataRes.success) {
            return this.$message.error(formDataRes.message)
          }
        }
        const formJsonRes = await getFormByProcessDefinitionId({ modelId: formDataRes.result.modelId, processDefinitionId: formDataRes.result.processDefinitionId })
        if (!formJsonRes.success) {
          return this.$message.error(formJsonRes.message)
        }
        this.processData.formData = JSON.parse(formDataRes.result.formData)
        this.processData.formJson = JSON.parse(formJsonRes.result.htmlJson)
        if (formDataRes.result.appendFormList) {
          this.processData.appendFormList = formDataRes.result.appendFormList
        }
        this.spinning = false
      } catch (err) {
        console.log(err)
      }
    }
  },
  mounted() {
    this.loadKDF()
  }
}
</script>
